<template>
	<!-- 顶部导航栏 -->
	<view class="box cu-item">
		<view 
		class="top-cont"></view>
		<view
		class="set flex justify-between padding-sm align-center">
		<text
		@click="handleBack"
		 style="font-size: 25px;" class="cuIcon-close"></text>
		<text
		style="font-size: 20px;">【修改质料】</text>
		<text 
		@click="handleComt"
		style="font-size: 20px;">完成</text>
		</view>
	</view>
	<view >
		<view class="text-center margin-top-xl">
			<view 
			@click="avatarUpload"
			class="text-center img-box">
				<image
				:src="avatar?avatar:''" mode="aspectFill"></image>
				<text 
				v-if="!avatar"
				class="img-text">点击上传图片</text>
			</view>
			<view class="padding">
				<custom-input 
				v-model="realname" 
				icon="cuIcon-people" 
				holder="请输入真实姓名">
				</custom-input>
			</view>
			<view class="solids">
				<textarea adjust-position class="textarea"
				 v-model="autograph" placeholder="描述"
				placeholder-style="color:#BEBDC2" 
				@blur="handleE"
				@confirm="handleE"></textarea>
			</view>
			
		</view>
	</view>
</template>

<script setup lang="ts">
import {type Ref, ref } from 'vue';
import { useCounterStore } from '@/store/counter';
import { userUpdate } from '@/api/user_api';
const counter=useCounterStore()
const avatar=ref<string>('')//头像变量
const autograph=ref<string>('')
const handleE=()=>{
	return autograph.value
}
const handleBack=()=>{
	uni.navigateBack({
		delta:1
	})
}
const realname:Ref<string>=ref('王毅')
//头像上传
const avatarUpload=()=>{
	uni.chooseImage({
		count:1,
		success: (file) => {
			console.log(file);
			let temp = file.tempFilePaths[0] //2. 临时资源路径
			uni.uploadFile({
				url: 'http://1.95.67.194:3000/upload', 
				filePath:temp,
				name:'avatar',
				success: (res) => {
					console.log(res);
					let url = JSON.parse(res.data).url
					avatar.value=url
					uni.showToast({
						title:'上传成功',
						icon:'none'
					})
				},
				fail: (err) => {
					console.log('失败',err);
					uni.showToast({
						title:'失败',
						icon:'none'
					})
				}
			})
		}
	})
}
//修改完成
const handleComt=async()=>{
	console.log(counter.userData?.sessionToken);
	console.log(handleE());
	let res=await userUpdate(counter.userData!.objectId,counter.userData!.sessionToken,{
		"avatar":avatar.value,
		"name":realname.value,
		"autograph":handleE()
		
	})
	console.log(res);
	uni.setStorage({
		key:'userinfo',
		data:{
			...counter.userData,
			"avatar":avatar.value,
			"name":realname.value,
			"autograph":handleE()
		}
	})
	uni.showToast({
		title:'修改成功',
		icon:'none'
	})
	uni.navigateBack({
		delta:1
	})
}
</script>

<style lang="scss">
page{
	background-color: #fff;
}
.box{
	position: sticky;
	top:0;
	z-index: 777;
	background-color: white;
	.top-cont{
		height: 35px;
	}
} 
.img-box{
	position: relative;
}
image{
	
	width: 250rpx;
	height: 250rpx;
	border: 1rpx solid #ccc;
	background-color: #ccc;
	
}  
.img-text{
		position: absolute;
		bottom: 125rpx;
		left: 39%;
	}
.textarea {
			padding: 20upx;
			background-color: #FFFFFF;
			border-radius: 8upx;
			font-size: 26upx;
			height: 80upx;
			font-size: 32upx;
		}

		.textarea {
			min-height: 250upx;
			margin-left: 40upx;
			font-size: 32upx;
		}
</style>
